@import "nib"
@import "_variables"
@import "_util/mixin"
@import "_util/grid"
@import "_util/animation"
@import "_extend"

global-reset()

h1, h2, h3, h4, h5, h6
  font-family: font-title
  font-weight: 700

input, button
  margin: 0
  padding: 0

  &::-moz-focus-inner
    border: 0
    padding: 0

html, body, #container
  height: 100%
  if reimu_cursor
    cursor: url(/images/cursor/reimu-cursor-default.cur), auto

body
  background: var(--color-background)
  -webkit-text-size-adjust: 100%
  font-family: font-sans
  transition: background 0.3s ease

if reimu_cursor
  a
    cursor: url(/images/cursor/reimu-cursor-pointer.cur), pointer !important

  .site-search
    input
      cursor: url(/images/cursor/reimu-cursor-text.cur), text !important
  
  #main
    span, p, code, kbd, input, textarea
      cursor: url(/images/cursor/reimu-cursor-text.cur), text !important

    nav
      span
        cursor: url(/images/cursor/reimu-cursor-default.cur), auto !important

.outer
  clearfix()
  max-width: (column-width + gutter-width) * columns + gutter-width
  margin: 0 auto
  padding: 0
  overflow: hidden

.inner
  column(columns)

.left, .alignleft
  float: left

.right, .alignright
  float: right

.clear
  clear: both

#container
  position: relative

.mobile-nav-on
  overflow: hidden !important

#wrap
  height: 100%
  width: 100%
  position: absolute
  top: 0
  left: 0
  transition: 0.3s ease
  z-index: 1
  background: var(--color-background)

#main
  padding: 0 5px
  max-width: 100%
  box-sizing: border-box

  @media mg-large
    min-width: 100%

#content
  position: relative
  padding-top: 5px
  display: flex
  align-items: stretch

  &.outer
    overflow: visible

if sidebar
  #main
    @media mq-large
      padding: 0
      column(main-column)

#mask
  position: fixed
  top: 0
  left: 0
  width: 100%
  height: 100%
  background: rgba(0, 0, 0, 0.5)
  display: none
  z-index: 1000

  .mobile-nav-on &
    display: block

@import "_partial/header"
@import "_partial/article"
@import "_partial/post"
@import "_partial/comment"
@import "_partial/archive"
@import "_partial/footer"
@import "_partial/mobile"
@import "_partial/highlight"
@import "_partial/widget.styl"
@import "_partial/friend.styl"
@import "_partial/search.styl"

if sidebar
  @import "_partial/sidebar"

[data-theme="dark"]
  ::-webkit-scrollbar, ::-webkit-scrollbar-track
    background-color: #616161

::-webkit-scrollbar
  width: 10px
  height: 10px
  background-color: #f5f5f5

::-webkit-scrollbar-track
  border-radius: 10px
  background-color: #f5f5f5

::-webkit-scrollbar-thumb
  border-radius: 10px
  background-color: var(--red-3)

.pace
  -webkit-pointer-events: none
  pointer-events: none
  -webkit-user-select: none
  -moz-user-select: none
  user-select: none

.pace-inactive
  display: none

.pace .pace-progress
  background: var(--red-1)
  position: fixed
  z-index: 2000
  top: 0
  right: 100%
  width: 100%
  height: 2px
